<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html id="housewifes">
<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <meta charset="utf-8">
    <meta name="robots" content="noodp,noydir">
    <meta name="description" content=" Housewifes - сервис для домохозяек.">
    <link rel="alternate" media="handheld" href="/">

    <link type="text/css" rel="stylesheet" href="../main/webapp/css/main_hw.css">
    <link type="text/css" rel="stylesheet" href="../main/webapp/css/header_hw.css">
    <link type="text/css" rel="stylesheet" href="../main/webapp/css/footer_hw.css">
    <link type="text/css" rel="stylesheet" href="../main/webapp/css/menu_hw.css">
    <link type="text/css" rel="stylesheet" href="../main/webapp/css/housewifes.css">
    <link type="text/css" rel="stylesheet" href="../main/webapp/css/jcrousel/style.css">
    <link rel="stylesheet" type="text/css" href="../main/webapp/css/jcrousel/skins/tango/skin_ut_breaf.css"/>
    <link rel="stylesheet" type="text/css" href="../main/webapp/css/jquery.treeview.css"/>

    <script type="text/javascript" src="../main/webapp/script/jquery-1.4.2.js"></script>
    <script type="text/javascript" src="../main/webapp/script/jquery.jcarousel.js"></script>

</head>

<body>
<div id="globalContainer">
<table border="0" width="100%" cellpadding="0" cellspacing="0">
<tr>
    <td class="main_header_container gradientV2">
        <table class="main_header_table" align="center" cellpadding="0" cellspacing="0" border="0">
            <tr>
                <td class="header_left gradientV2">
                    <span class="header_logo_span">DомохоzЯйки</span>
                </td>
                <td class="header_center gradientV2">
                    <table border="0" cellpadding="0" cellspacing="0" style="height:16px">
                        <tr >
                            <td>
                                <input placeholder="Поиск" class="header_search_input">
                            </td>
                            <td>
                                <span title="Поиск" class="header_search_spanbtn"></span>
                            </td>
                        </tr>
                    </table>
                </td>
                <td class="header_right gradientV2">
                    <span class="header_span"><a href="http://test.server.ru" class="header_link">помощь</a></span>
                    <span class="header_span"><a href="http://test.server.ru" class="header_link">выйти</a></span>
                </td>
            </tr>
        </table>
    </td>
</tr>
<tr>
    <td height="600">
        <table class="main_container_table" align="center" cellpadding="0" cellspacing="0">
            <tr>
                <td rowspan="2" class="main_menu_cell">
                    <table width="100%" border="0" cellpadding="0" cellspacing="0">
                        <tr>
                            <td>
                                <a href="http://test.server.ru" class="menu_link">
                                    <div class="menu_item selected_menu_item">
                                                <span class="menu_icon_countainer">
                                                    <!--<i class="sp_9rf1fr sx_001"></i>-->
                                                    <i class="menu_icon_img_0"></i>
                                                </span>
                                        <span class="menu_title_conteiner">Главная</span>
                                    </div>
                                </a>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <a href="http://test.server.ru" class="menu_link">
                                    <div class="menu_item">
                                                <span class="menu_icon_countainer">
                                                    <i class="menu_icon_img_1"></i>
                                                </span>
                                        <span class="menu_title_conteiner">Мои таблицы</span>
                                    </div>
                                </a>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <a href="http://test.server.ru" class="menu_link">
                                    <div class="menu_item">
                                                <span class="menu_icon_countainer">
                                                    <i class="menu_icon_img_2"></i>
                                                </span>
                                        <span class="menu_title_conteiner">Мои рецепты</span>
                                    </div>
                                </a>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <a href="http://test.server.ru" class="menu_link">
                                    <div class="menu_item">
                                                <span class="menu_icon_countainer">
                                                    <i class="menu_icon_img_3"></i>
                                                </span>
                                        <span class="menu_title_conteiner">Избранные рецепты</span>
                                    </div>
                                </a>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <a href="http://test.server.ru" class="menu_link">
                                    <div class="menu_item">
                                                <span class="menu_icon_countainer">
                                                    <i class="menu_icon_img_4"></i>
                                                </span>
                                        <span class="menu_title_conteiner">Мои цены</span>
                                    </div>
                                </a>
                            </td>
                        </tr>
                    </table>
                    <br/>
                    <table width="100%" border="0" cellpadding="0" cellspacing="0">
                        <tr>
                            <td>
                                <a href="http://test.server.ru" class="menu_link">
                                    <div class="menu_item">
                                                <span class="menu_icon_countainer">
                                                    <i class="menu_icon_img_5"></i>
                                                </span>
                                        <span class="menu_title_conteiner">Поиск таблиц</span>
                                    </div>
                                </a>

                            </td>
                        </tr>
                        <tr>
                            <td>
                                <a href="http://test.server.ru" class="menu_link">
                                    <div class="menu_item">
                                                <span class="menu_icon_countainer">
                                                    <i class="menu_icon_img_6"></i>
                                                </span>
                                        <span class="menu_title_conteiner">Поиск рецептов</span>
                                    </div>
                                </a>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <a href="http://test.server.ru" class="menu_link">
                                    <div class="menu_item">
                                                <span class="menu_icon_countainer">
                                                    <i class="menu_icon_img_7"></i>
                                                </span>
                                        <span class="menu_title_conteiner">Пойти в магазин</span>
                                    </div>
                                </a>
                            </td>
                        </tr>
                    </table>
                </td>

                <td class="main_content_cell">

                    <!-- MAIN CONTENT AREA START-->
                    <table width="100%"  border="0" cellpadding="0" cellspacing="0">
                        <tr>
                            <td height="200" valign="top">
                                <table width="100%" cellpadding="0" cellspacing="0">
                                    <tr>
                                        <td height="35" class="gradientV2">
                                            <div class="block_header_title">
                                                Добавление рецепта в 13-ый день таблицы "My first menu(60 дней)"
                                            </div>
                                        </td>
                                    </tr>
                                </table>

                                <table cellpadding="0" cellspacing="0" border="0" width="100%" class="recipe_select_block">
                                    <tr>
                                        <td colspan="2" align="center" height="35px">
                                            <div class="block_header_title">
                                                Выберите рецепт на
                                                <select name="eatingType" style="height: 23px">
                                                    <option value="BREAKFAST">Завтрак</option>
                                                    <option value="DINNER">Обед</option>
                                                    <option value="LUNCH">Полдник</option>
                                                    <option value="SUPPER">Ужин</option>
                                                    <option value="OTHER">Другое</option>
                                                </select>
                                            </div>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td colspan="2">
                                            <div id="selectRecipeDialog">
                                                <table cellpadding="0" cellspacing="0">
                                                    <tr>
                                                        <td class="recipe_groups_block" width="40%">
                                                            <div style="width: 100%; height: 710px; border: #000000 solid 0px; overflow: auto">
                                                                <div id="recipeGroupsContainer" class="filetree treeview treeview-hw"></div>
                                                            </div>
                                                        </td>
                                                        <td width="60%" valign="top">
                                                            <div id="recipesContainer">
                                                                <ul class="recipes_list">
                                                                    <li class="recipe_link">
                                                                        <span>яичница с помидорами</span>
                                                                    </li>
                                                                    <li class="recipe_link">
                                                                        <span>гренки с сахаром</span>
                                                                    </li>
                                                                    <li class="recipe_link">
                                                                        <span>пирожек в кармене</span>
                                                                    </li>
                                                                    <li class="recipe_link">
                                                                        <span>бигмак - ывафывафыв паф паф ыапф ыапфыап фпфпаппппппппппппппппппппппппппппппппп фып фыв ап</span>
                                                                    </li>
                                                                </ul>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                </table>
                                            </div>
                                        </td>
                                    </tr>
                                </table>



                            </td>
                        </tr>
                    </table>
                    <!-- MAIN CONTENT AREA END-->

                </td>
            </tr>
            <tr>
                <td class="main_footer_cell">
                    <span class="footer_text_block">DомохоzЯйки © 2011-2012</span>
                    <span class="footer_text_block">&nbsp;&nbsp;&nbsp;</span>
                    <a href="http://test.server.ru" class="footer_link">о сайте</a>
                    <a href="http://test.server.ru" class="footer_link">помощь</a>
                    <a href="http://test.server.ru" class="footer_link">правила</a>
                    <a href="http://test.server.ru" class="footer_link">реклама</a>
                    <a href="http://test.server.ru" class="footer_link">реклама</a>
                </td>
            </tr>
        </table>
    </td>
</tr>

</table>
</div>

</body>

<script type="text/javascript">

var treeData = [
    {
        id: '1', title: '001', folder: true, closed: true,
        children: [
            {
                id: '1-1', title: '001-1', folder: true, closed: true,
                children: [
                    {id: '1-1-1', title: '001-1-1', folder: false},
                    {id: '1-1-2', title: '001-1-2', folder: false},
                    {id: '1-1-3', title: '001-1-3', folder: false}
                ]
            },
            {
                id: '1-2', title: '001-2', folder: true, closed: true,
                children: [
                    {id: '1-2-1', title: '001-2-1', folder: false},
                    {id: '1-2-2', title: '001-2-2', folder: false},
                    {id: '1-2-3', title: '001-2-3', folder: false}
                ]
            },
            {
                id: '1-3', title: '001-3', folder: true,
                children: [
                    {id: '1-3-1', title: '001-3-1(Proxy)', folder: true, needLoad: true},
                    {id: '1-3-2', title: '001-3-2', folder: false},
                    {id: '1-3-3', title: '001-3-3', folder: false}
                ]
            }
        ]
    },
    {
        id: '2', title: '002', folder: true,
        children: [
            {
                id: '2-1', title: '002-1', folder: true,
                children: [
                    {id: '2-1-1', title: '002-1-1', folder: false},
                    {id: '2-1-2', title: '002-1-2', folder: false},
                    {id: '2-1-3', title: '002-1-3', folder: false}
                ]
            },
            {
                id: '2-2', title: '002-2', folder: true,
                children: [
                    {id: '2-2-1', title: '002-2-1', folder: false},
                    {id: '2-2-2', title: '002-2-2', folder: false},
                    {id: '2-2-3', title: '002-2-3', folder: false}
                ]
            },
            {
                id: '2-3', title: '002-3', folder: true,
                children: [
                    {id: '2-3-1', title: '002-3-1', folder: false},
                    {id: '2-3-2', title: '002-3-2', folder: false},
                    {id: '2-3-3', title: '002-3-3', folder: false}
                ]
            }
        ]
    },
    {
        id: '3', title: '003', folder: true, closed: true,
        children: [
            {
                id: '3-1', title: '003-1', folder: true,
                children: [
                    {id: '3-1-1', title: '003-1-1', folder: false},
                    {id: '3-1-2', title: '003-1-2', folder: false},
                    {id: '3-1-3', title: '003-1-3', folder: false}
                ]
            },
            {
                id: '3-2', title: '003-2', folder: true,
                children: [
                    {id: '3-2-1', title: '003-2-1', folder: false},
                    {id: '3-2-2', title: '003-2-2', folder: false},
                    {id: '3-2-3', title: '003-2-3', folder: false}
                ]
            },
            {
                id: '3-3', title: '003-3', folder: true,
                children: [
                    {id: '3-3-1', title: '003-3-1', folder: false},
                    {id: '3-3-2', title: '003-3-2', folder: false},
                    {id: '3-3-3', title: '003-3-3', folder: true}
                ]
            }
        ]
    }
];

function addLevel(container, data) {

    var showChildrenUl = function(li, hitarea, ul) {
        hitarea.addClass('collapsable-hitarea');
        hitarea.removeClass('expandable-hitarea');
        li.removeClass('expandable');
        ul.show();
    };

    var hideChildrenUl = function(li, hitarea, ul) {
        hitarea.removeClass('collapsable-hitarea');
        hitarea.addClass('expandable-hitarea');
        li.addClass('expandable');
        ul.hide();
    };

    var loadChildren = function(parentId) {
        var testChildren = [
            {id: 'chld-1-for-' + parentId, title: 'chld-1-for-' + parentId, folder: false},
            {id: 'chld-2-for-' + parentId, title: 'chld-2-for-' + parentId, folder: false},
            {id: 'chld-3-for-' + parentId, title: 'chld-3-for-' + parentId, folder: true, closed: true,
                children: [
                    {id: 'chld-3-1-for-' + parentId, title: 'chld-3-1-for-' + parentId, folder: false},
                    {id: 'chld-3-2-for-' + parentId, title: 'chld-3-2-for-' + parentId, folder: false},
                    {id: 'chld-3-3-for-' + parentId, title: 'XXXXXXXXXXXXXXXXXXXXXXXXXX-chld-3-3-for-' + parentId, folder: false}
                ]
            }
        ];
//            alert('going to load children');
//            alert('children loaded');
        return testChildren;
    };

    $.each(data, function(index, value) {
        //alert('2');
        var nodeId = value.id;
        var nodeTitle = value.title;
        var nodeIsFolder = value.folder;
        var folderClosed = value.closed;
        var nodeNeedLoadChildren = value.needLoad;

        var li = $('<li/>');
        container.append(li);

        var spans = $('<span style="cursor: pointer; border: red solid 0px; display: inline; text-wrap: none"><span class="hidden_id">' + nodeId + '</span>' + nodeTitle +'</span>');
        spans.addClass(nodeIsFolder ? "folder" : "file");

        var ul = $('<ul/>');

        var toggleItem = function() {
            if (nodeNeedLoadChildren) {
                li.append('<span class="placeholder"/>');
//                    alert('111');
                value['children'] = loadChildren(nodeId);
                $(".placeholder").remove();
                addLevel(ul, value['children']);
                nodeNeedLoadChildren = false;
//                        alert('111');
            }
            if (ul.is(":visible")) {
                hideChildrenUl(li, hitarea, ul);
            } else {
                showChildrenUl(li, hitarea, ul);
            }
        };
        if (nodeIsFolder) {
            var hitarea = $('<div class="hitarea collapsable-hitarea"></div>');
            hitarea.click(function() {
                toggleItem();
            });
            li.append(hitarea);
            if (folderClosed || nodeNeedLoadChildren) {
                hideChildrenUl(li, hitarea, ul);
            }
        }
        spans.click(function() {
            var idOfNode = $(this).children(".hidden_id").text();
            if (value.folder) {
                //alert('id folder: ' + idOfNode);
                toggleItem();
            } else {
                // alert('id file: ' + idOfNode);
                if (li.hasClass("selected")) {
                    li.removeClass("selected");
                } else {
                    li.addClass("selected");
                }
            }
        });


        li.append(spans);
        if (nodeIsFolder) {
            li.append(ul);
            if (!nodeNeedLoadChildren) {
                addLevel(ul, value['children']);
            }
        }

    });
}

$(document).ready(function() {
    //alert('1');
    // TEST CREATING HTML TREE
    var container = $("#recipeGroupsContainer");
    var ul = $('<ul/>');
    container.append(ul);
    addLevel(ul, treeData);
});

$(document).ready(function(){

    $(".menu_item").each(function() {
        $(this).hover(
                function() {
                    if (!$(this).hasClass("selected_menu_item")) {
                        $(this).addClass("menu_item_hover");
                    }
                },
                function(){
                    $(this).removeClass("menu_item_hover");
                }
        );
    });
    $(".save_receipes_count_btn").each(function() {
        $(this).hover(
                function() {
                    $(this).addClass("menu_item_hover");
                },
                function(){
                    $(this).removeClass("menu_item_hover");
                }
        );
    });
    $(".active_daymenu").each(function() {
        $(this).hover(
                function() {
                    $(this).addClass("active_daymenu_hover");
                },
                function(){
                    $(this).removeClass("active_daymenu_hover");
                }
        );
    });
    $(".cur_active_daymenu").each(function() {
        $(this).hover(
                function() {
                    $(this).addClass("active_daymenu_hover");
                },
                function(){
                    $(this).removeClass("active_daymenu_hover");
                }
        );
    });

    jQuery('.usertable_breaf').show();

    /*
     jQuery('.usertable_breaf').jcarousel({
     scroll: 1,
     start: 2
     });
     */

    jQuery('#mycarousel').jcarousel({
        scroll: 1,
        start: 2
    });
    jQuery('#mycarouse2').jcarousel({
        scroll: 1,
        start: 1
    });

    /*
     setTimeout(function() {
     $("#globalContainer").show();
     }, 100);
     */

    $("input.onlyNumbers").keydown(function(event) {
        // Allow: backspace, delete, tab, escape, and enter
        if ( event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 27 || event.keyCode == 13 ||
            // Allow: Ctrl+A
                (event.keyCode == 65 && event.ctrlKey === true) ||
            // Allow: home, end, left, right
                (event.keyCode >= 35 && event.keyCode <= 39)) {
            // let it happen, don't do anything
            return;
        }
        else {
            // Ensure that it is a number and stop the keypress
            if (event.shiftKey || (event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105 )) {
                event.preventDefault();
            }
        }
    });

});

$(document).ready(function() {

    $(".recipe_link").each(function() {
        $(this).hover(
                function() {
                    $(this).addClass("highlighted");
                },
                function() {
                    $(this).removeClass("highlighted");
                }
        );
    });
});


function isNumberKey(event) {
    // Allow: backspace, delete, tab, escape, and enter
    if ( event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 27 || event.keyCode == 13 ||
        // Allow: Ctrl+A
            (event.keyCode == 65 && event.ctrlKey === true) ||
        // Allow: home, end, left, right
            (event.keyCode >= 35 && event.keyCode <= 39)) {
        // let it happen, don't do anything
        return;
    }
    else {
        // Ensure that it is a number and stop the keypress
        if (event.shiftKey || (event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105 )) {
            event.preventDefault();
        }
    }
}

function onNumberInputKeyUp(receipeId, event) {
    var origValue = $("#orig_value_holder_" + receipeId).text();
    if ($(event.currentTarget).val() != origValue) {
        $("#save_btn_" + receipeId).show();
    } else {
        $("#save_btn_" + receipeId).hide();
    }
}

</script>

</html>